<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>运维管理平台</title>

    <!-- jQuery -->
    <script src="/static/vendor/jquery/jquery.min.js"></script>
    <!-- Bootstrap Core CSS -->
    <link href="/static/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link href="/static/vendor/metisMenu/metisMenu.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="/static/dist/css/sb-admin-2.css" rel="stylesheet">

    <!-- Morris Charts CSS -->
    <link href="/static/vendor/morrisjs/morris.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="/static/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

    <!-- Bootstrap Core JavaScript -->
    <script src="/static/vendor/bootstrap/js/bootstrap.min.js"></script>

    <!-- Metis Menu Plugin JavaScript -->
    <script src="/static/vendor/metisMenu/metisMenu.min.js"></script>
    
    <!-- Morris Charts JavaScript -->
    <script src="/static/vendor/raphael/raphael.min.js"></script>
    <script src="/static/vendor/morrisjs/morris.min.js"></script>

    
    <!-- Custom Theme JavaScript -->
    <script src="/static/dist/js/sb-admin-2.js"></script>  
      
    <!-- Flot Charts JavaScript -->
    <script src="/static/vendor/flot/excanvas.min.js"></script>
    <script src="/static/vendor/flot/jquery.flot.js"></script>
    <script src="/static/vendor/flot/jquery.flot.pie.js"></script>
    <script src="/static/vendor/flot/jquery.flot.resize.js"></script>
    <script src="/static/vendor/flot/jquery.flot.time.js"></script>
    <script src="/static/vendor/flot-tooltip/jquery.flot.tooltip.min.js"></script>
    
  <!-- DataTables JavaScript -->
  <link rel="stylesheet" href="/static/dist/css/jquery.dataTables.min.css">
  <script src="/static/js/jquery.dataTables.min.js"></script>   
	<style type="text/css"> 	
		td.details-control {
		    background: url('/static/img/details_open.png') no-repeat center center; */
		    cursor: pointer;
		}
		tr.shown td.details-control {
		    background: url('/static/img/details_close.png') no-repeat center center;
		} 
	</style>   
</head>

<body>

    <div id="wrapper">

        <!-- Navigation -->
        <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="index.html">OpsManage v2.0</a>
            </div>
            <!-- /.navbar-header -->

            <ul class="nav navbar-top-links navbar-right">
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        <i class="fa fa-bell fa-fw">
                        </i><span class="badge" id="deploy_order_count"></span>
                        <i class="fa fa-caret-down"></i>
                    </a>
	                <ul class="dropdown-menu dropdown-messages" id="deploy_order"> 
	                </ul>              	
                    <!-- /.dropdown-messages -->
                </li>
                <!-- /.dropdown -->
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        {{user}} <i class="fa fa-user fa-fw"></i><iclass="fa fa-caret-down"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-user">
                        <li><a href="/user/center/"><i class="fa fa-user fa-fw"></i> User Profile</a>
                        </li>
                        <li><a href="#"><i class="fa fa-gear fa-fw"></i> Settings</a>
                        </li>
                        <li class="divider"></li>
                        <li><a href="/logout"><i class="fa fa-sign-out fa-fw"></i> Logout</a>
                        </li>
                    </ul>
                    <!-- /.dropdown-user -->
                </li>
                <!-- /.dropdown -->
            </ul>
            <!-- /.navbar-top-links -->

            <div class="navbar-default sidebar" role="navigation">
                <div class="sidebar-nav navbar-collapse">
                    <ul class="nav" id="side-menu">
                        <li class="sidebar-search">
                            <div class="input-group custom-search-form">
                                <input type="text" class="form-control" placeholder="Search...">
                                <span class="input-group-btn">
                                <button class="btn btn-default" type="button">
                                    <i class="fa fa-search"></i>
                                </button>
                            </span>
                            </div>
                            <!-- /input-group -->
                        </li>
                        <li>
                            <a href="/"><i class="fa fa-dashboard fa-fw"></i> Dashboard</a>
                        </li>
                        <li>
                            <a href="#"><i class="fa  fa-bank fa-fw"></i> 资产管理<span class="fa arrow"></span></a>
                            <ul class="nav nav-second-level">
                                <li>
                                    <a href="/assets_config">基础配置</a>
                                </li>
                                <li>
                                    <a href="/assets_add">添加资产</a>
                                </li>
								<li>
                                    <a href="/assets_list">资产列表</a>
                                </li>
								<li>
                                    <a href="/assets_search/">资产查询</a>
                                </li>                                
								<li>
	                                <a href="/assets_log/1/">操作日志</a>
	                            </li>                                                                 
                            </ul>
                            <!-- /.nav-second-level -->
                        </li>                        
                        <li>
                            <a href="#"><i class="glyphicon glyphicon-hdd"></i> 代码发布<span class="fa arrow"></span></a>
                            <ul class="nav nav-second-level">
                                <li>
                                    <a href="/deploy_add">项目配置</a>
                                </li>
                                <li>
                                    <a href="/deploy_list">项目列表</a>
                                </li>
								<li>
	                                <a href="/deploy_log/1/">操作日志</a>
	                            </li>                                
                            </ul>
                            <!-- /.nav-second-level -->
                        </li>
                        <li>
                            <a href="#"><i class="fa fa-table fa-fw"></i> 任务管理<span class="fa arrow"></span></a>
                            <ul class="nav nav-second-level">
                                <li>
                                    <a href="/cron_add">添加任务</a>
                                </li>                            
                                <li>
                                    <a href="/cron_config">批量导入</a>
                                </li>
                                <li>
                                    <a href="/cron_list/1/">任务列表</a>
                                </li>
								<li>
	                                 <a href="/cron_log/1/">操作日志</a>
	                            </li>                                 
                            </ul>
                            <!-- /.nav-second-level -->
                        </li>                          
                        <li>
                            <a href="#"><i class="fa fa-sitemap fa-fw"></i> 应用部署<span class="fa arrow"></span></a>
                            <ul class="nav nav-second-level">
                            	<li><a href="/apps/inventory/">动态资产</a></li>
                                <li>
                                    <a href="/apps/model">运行模块</a>
                                </li>
                                <li>
                                    <a href="#">脚本工具<span class="fa arrow"></span></a>
                                    <ul class="nav nav-third-level">
                                        <li>
                                            <a href="/apps/script/online/">在线添加</a>
                                        </li>
                                        <li>
                                            <a href="/apps/script/list/">脚本列表</a>
                                        </li>                                        
                                    </ul>                                  
                                </li>                                  
                                <li>
                                    <a href="#">剧本配置<span class="fa arrow"></span></a>
                                    <ul class="nav nav-third-level">
                                        <li>
                                            <a href="/apps/playbook/upload/">上传剧本</a>
                                        </li>
                                        <li>
                                            <a href="/apps/playbook/online/">在线编辑</a>
                                        </li>                                        
                                        <li>
                                            <a href="/apps/">剧本列表</a>
                                        </li>
                                        {% if user.is_superuser %}
                                        <li><a href="/roles/">剧本管理</a></li>
                                        {% endif %}
                                    </ul>
                                    <!-- /.nav-third-level -->
                                </li>
								<li>
                                    <a href="/apps/log/">操作日志</a>
                                </li>                                  
                            </ul>
                            <!-- /.nav-second-level -->
                        </li>
						<li><a href="#"><i class="fa fa-database fa-fw"></i> 数据管理<span
								class="fa arrow"></span></a>
							<ul class="nav nav-second-level">
								<li><a href="#">MySQL<span class="fa arrow"></span></a>
									<ul class="nav nav-third-level">
										<li><a href="/db/config/">基础配置</a></li>
										<li><a href="/db/sql/ops/">管理入口</a></li>											
									</ul>
								</li>															
								<li><a href="/db/sql/logs/1/">操作日志</a></li>
							</ul> <!-- /.nav-second-level --></li>		                        
                        {% if user.is_superuser %}
						<li><a href="#"><i class="fa fa-tasks fa-fw"></i> 任务调度<span
								class="fa arrow"></span></a>
							<ul class="nav nav-second-level">
								<li><a href="/task_model/">调度类型</a></li>
								<li><a href="/task_view/">运行日志</a></li>
							</ul> <!-- /.nav-second-level --></li>     
						{% endif %} 
						<li><a href="#"><i class="fa fa-bookmark fa-fw"></i> 运维知识<span
								class="fa arrow"></span></a>
							<ul class="nav nav-second-level">
								<li><a href="/wiki/add/">新建文档</a></li>
								<li><a href="/wiki/index/">文档列表</a></li>
							</ul> <!-- /.nav-second-level --></li>		
						<li><a href="#"><i class="fa  fa-ticket fa-fw"></i> 工单系统<span
								class="fa arrow"></span></a>
							<ul class="nav nav-second-level">
								<li><a href="#">工单申请<span class="fa arrow"></span></a>
									<ul class="nav nav-third-level">
										<li><a href="/order/deploy/apply/">代码部署</a></li>
										<li><a href="/order/sql/apply/">上线SQL</a></li>
										<li><a href="/order/file/upload/list/1/">文件分发</a></li>
										<li><a href="/order/file/download/list/1/">文件下载</a></li>
									</ul></li>
								<li><a href="/order/list/1/">工单列表</a></li>
								<li><a href="/order/search/">工单查询</a></li>
							</ul> <!-- /.nav-second-level --></li>													                  
                        <li>
                            <a href="/config"><i class="fa fa-wrench fa-fw"></i> 全局配置</a>
                        </li>                           
                        <li>
                            <a href="#"><i class="fa fa-group "></i> 用户中心<span class="fa arrow"></span></a>
                            <ul class="nav nav-second-level">
                            	<li>
                                    <a href="/users/manage">用户管理</a>
                                </li>
                                <li>
                                    <a href="/user/center/">用户配置</a>
                                </li>
                                <li>
                                    <a href="/logout">退出</a>
                                </li>
                            </ul>
                            <!-- /.nav-second-level -->
                        </li>
                    </ul>
                </div>
                <!-- /.sidebar-collapse -->
            </div>
            <!-- /.navbar-static-side -->
        </nav>

<div id="page-wrapper">
     <div class="row">
          <div class="col-lg-12">
              <h1 class="page-header"><i class="fa   fa-dashboard"></i>资产列表</h1>
          </div>
                <!-- /.col-lg-12 -->
      </div>
            <!-- /.row -->
	<div class="row">
                <div class="col-lg-3 col-md-6">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <div class="row">
                                <div class="col-xs-3">
                                    <i class="fa fa-desktop fa-5x"></i>
                                </div>
                                <div class="col-xs-9 text-right">
                                    <div class="huge">{{totalAssets}}</div>
                                    <div>总资产</div>
                                </div>
                            </div>
                        </div>
                        <a href="#">
                            <div class="panel-footer">
                                <span class="pull-left">View Details</span>
                                <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                <div class="clearfix"></div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="panel panel-green">
                        <div class="panel-heading">
                            <div class="row">
                                <div class="col-xs-3">
                                    <i class="fa fa-check  fa-5x"></i>
                                </div>
                                <div class="col-xs-9 text-right">
                                    <div class="huge">{{assetOnline}}</div>
                                    <div>上线</div>
                                </div>
                            </div>
                        </div>
                        <a href="#">
                            <div class="panel-footer">
                                <span class="pull-left">View Details</span>
                                <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                <div class="clearfix"></div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="panel panel-yellow">
                        <div class="panel-heading">
                            <div class="row">
                                <div class="col-xs-3">
                                    <i class="fa fa-wrench fa-5x"></i>
                                </div>
                                <div class="col-xs-9 text-right">
                                    <div class="huge">{{assetMaintain}}</div>
                                    <div>维修</div>
                                </div>
                            </div>
                        </div>
                        <a href="#">
                            <div class="panel-footer">
                                <span class="pull-left">View Details</span>
                                <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                <div class="clearfix"></div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="panel panel-red">
                        <div class="panel-heading">
                            <div class="row">
                                <div class="col-xs-3">
                                    <i class="glyphicon glyphicon-floppy-remove  fa-5x"></i>
                                </div>
                                <div class="col-xs-9 text-right">
                                    <div class="huge">{{assetOffline}}</div>
                                    <div>下线</div>
                                </div>
                            </div>
                        </div>
                        <a href="#">
                            <div class="panel-footer">
                                <span class="pull-left">View Details</span>
                                <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                <div class="clearfix"></div>
                            </div>
                        </a>
                    </div>
                </div>
     </div>            
     <div class="row">
         <div class="col-lg-6">
              <div class="panel panel-default">
                    <div class="panel-heading">
                           	 <i class="fa fa-sitemap"></i>设备资产比率
                     </div>
                        <!-- /.panel-heading -->
                     <div class="panel-body">
                     <div class="flot-chart">
                          <div class="flot-chart-content" id="assets_per"></div>
                          </div>
                     </div>
                        <!-- /.panel-body -->
              </div>
                    <!-- /.panel -->
         </div>    
                <div class="col-lg-6">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                           	<i class="fa fa-bookmark"></i> 设备资产明细
                        </div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <div id="asset_number"></div>
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div> 
     </div>
     <div class="row">
          <div class="col-lg-12">
              <div class="panel panel-default">
                  <div class="panel-heading">
                      <i class="fa fa-keyboard-o  fa-fw"></i> 资产查询
                  </div>
                  <div class="panel-body">
				      <div class="col-xs-6 col-sm-3">
							<div class="form-group">
								<label class="col-sm-3 control-label">设备状态:</label>
								<div class="col-sm-8">
									<select class="form-control"  id="selStatus"  >
										<option selected="selected" value="">请选择一个类型</option>
										<option value="0" name="status">已上线</option>	
										<option value="1" name="status">已下线</option>	
										<option value="2" name="status">维修中</option>	
										<option value="3" name="status">已入库</option>	
										<option value="4" name="status">未使用</option>				   		
									</select>
								</div>
							</div>
				      </div>                  
				      <div class="col-xs-6 col-sm-3">
							<div class="form-group">
								<label class="col-sm-3 control-label">所属产品线:</label>
								<div class="col-sm-8">
									 <select class="form-control" id="selProject" >
									 	<option selected="selected" value="">请选择一个类型</option>
									 	{% for b in baseAssets.project %}
									 		<option value="{{b.id}}" name="project">{{b.project_name}}</option>
									 	{% endfor %}				
									</select>
								</div>
							</div>
				      </div>                  
				      <div class="col-xs-6 col-sm-3">
							<div class="form-group">
								<label class="col-sm-3 control-label">所属业务:</label>
								<div class="col-sm-8">
									 <select class="form-control" id="selBusiness" >
									 	<option selected="selected" value="">请选择一个类型</option>
									 	{% for s in baseAssets.service %}
									 		<option value="{{s.id}}" name="business">{{s.service_name}}</option>
									 	{% endfor %}										 					
									</select> 
								</div>
							</div>
				      </div>
<!-- 				      <div class="col-xs-6 col-sm-3">
							<div class="form-group">
								<label class="col-sm-3 control-label">IP地址:</label>
							<div class="input-group">
								<input type="text" class="form-control">
								<span class="input-group-btn">
									<button class="btn btn-default" type="button">Search</button>
								</span>
							</div>								
							</div>
				      </div> -->		
				      <div class="col-xs-6 col-sm-3">
							<div class="form-group">
								<label class="col-sm-3 control-label">IP地址:</label>
								<div class="col-sm-8">
									<input type="text" id="ip" class="form-control" value="">
								</div>
							</div>
				      </div>				      		      				      
                  </div>
                  <div class="panel-footer">
                  <div id="divSelectedType"></div>
                  </div>
              </div>
          </div>      
     </div>
     
	 <div class="row">
	 		<div class="col-lg-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
							    <div class="btn-group btn-group-xs pull-right">
							    	<button type="button" class="btn btn-default"><a href="#" data-toggle="modal" data-target="#myAssetsImportModal"><i class="fa fa-pencil fa-fw"></i>批量导入</a></button>
							    	<button type="button" class="btn btn-default" onclick="fcDumpsAssetsData(this)"><i class="fa fa-refresh fa-fw"></i>导出资产</button>
								    <button type="button" class="btn btn-default" onclick="updateAllAssets(this,'update')"><i class="fa fa-refresh fa-fw"></i>批量更新</button>
								    <button type="button" class="btn btn-default" onclick="updateAllAssets(this,'delete')"><i class="fa fa-trash-o fa-fw"></i>批量删除</button>
								</div>                         
                              <i class="fa fa-database"></i>资产明细
                                                        
                        </div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <table width="100%" class="table table-striped table-bordered table-hover" id="assetsListTable">
                                <thead>
									  <tr>
									  	   <th class="text-center">详情</th>
									  	   <th class="text-center"><input type="checkbox" onclick="checkAllBox()"/>全选</th>
									  	   <th class="text-center">资产ID</th>
									       <th class="text-center">资产类型</th>
									       <th class="text-center">管理IP</th>
									       <th class="text-center">资产编号</th>
									       <th class="text-center">设备型号</th>
									       <th class="text-center">放置区域</th>
									       <th class="text-center">产品线</th>
									       <th class="text-center">业务类型</th>
									       <th class="text-center">使用组</th>								       
									       <th class="text-center">设备状态</th>
									       <th class="text-center">操作</th>
									    </tr>
								        <tfoot>
								            <tr>
								               <th class="text-center">详情</th>
								               <th class="text-center">全选</th>
								               <th class="text-center">资产ID</th>
										       <th class="text-center">资产类型</th>
										       <th class="text-center">管理IP</th>
										       <th class="text-center">资产编号</th>
										       <th class="text-center">设备型号</th>
										       <th class="text-center">放置区域</th>
										       <th class="text-center">产品线</th>
										       <th class="text-center">业务类型</th>
										       <th class="text-center">使用组</th>
										       <th class="text-center">设备状态</th>
										       <th class="text-center">操作</th>
								            </tr>
								        </tfoot>									    
                                </thead>
                                <tbody>
                                	{% for a in  assetsList %}
	                                    <tr class="odd gradeX">
	                                    	 <td class="text-center"></td>
	                                    	 <td class="text-center"><input type="checkbox" value={{a.id}} name="ckbox"/></td>
	                                    	 <td class="text-center">{{ a.id }}</td>
									         <td class="text-center">	
									         		{% if a.assets_type == "server" %}
									         			服务器
									         		{% elif a.assets_type == "vmser" %}
									         			虚拟机	
									         		{% elif a.assets_type == "switch" %}
									         			交换机	
									         		{% elif a.assets_type == "route" %}
									         			路由器
									         		{% elif a.assets_type == "printer" %}
									         			打印机	
									         		{% elif a.assets_type == "scanner" %}
									         			扫描仪
									         		{% elif a.assets_type == "firewall" %}
									         			防火墙	
									         		{% elif a.assets_type == "storage" %}
									         			存储设备
									         		{% elif a.assets_type == "wifi" %}
									         			无线设备									         													         												         												         											         												         			
									         		{% endif %}
									         </td>
									         <td>
									         	{% if a.management_ip %}
													<ul class="list-unstyled">
						                                <li><span class="label label-danger">外</span>:<code>{{ a.management_ip }}</code></li>
						                                {% for ds in a.nks %}
						                                	{% if ds.ip != 'unkown' and ds.ip !=  a.management_ip %}
						                                		<li><span class="label label-success">内</span>:<code>{{ds.ip}}</code></li>
						                                	{% endif %}
						                                {% endfor %}
						                            </ul>									         			
									         											         		
									         	{% else %}
													<ul class="list-unstyled">
						                                <li><span class="label label-danger">外</span>:<code>{{ a.server_assets.ip }}</code></li>
						                                {% for ds in a.nks %}
						                                	{% if ds.ip != 'unkown' and ds.ip !=  a.server_assets.ip %}
						                                		<li><span class="label label-success">内</span>:<code>{{ds.ip}}</code></li>
						                                	{% endif %}
						                                {% endfor %}
						                            </ul>									         		
									         	{% endif %}
									         </td>
									         <td class="text-center">{{ a.name }}</td>
									         <td class="text-center">{{ a.model|default:"无" }}</td>
									         <td class="text-center">
									         	{% for z in baseAssets.zone %}
									         		{% if z.id == a.put_zone %}
									         			{{ z.zone_name }}
									         		{% endif %}
									         	{% endfor %}
									         </td>
									         <td class="text-center">
									         	{% for s in baseAssets.project %}
									         		{% if s.id == a.project %}
									         			{{ s.project_name }}	
									         		{% endif %}
									         	{% endfor %}								         		
									         </td>									         
									         <td class="text-center">
									         	{% for s in baseAssets.service %}
									         		{% if s.id == a.business %}
									         			{{ s.service_name }}	
									         		{% endif %}
									         	{% endfor %}								         		
									         </td>									         
									         <td class="text-center">
									         	{% for g in baseAssets.group %}
									         		{% if g.id == a.group %}
									         			{{ g.name }}
									         		{% endif %}
									         	{% endfor %}
									         </td>
									         <td class="text-center">
									         		{% if a.status == 0 %}
									         			<button  type="button" class="btn btn-outline btn-success">已上线</button>
									         		{% elif a.status == 1 %}
									         			<button  type="button" class="btn btn-outline btn-primary">已下线</button>
									         		{% elif a.status == 2 %}
									         			<button  type="button" class="btn btn-outline btn-warning">维修中</button>
									         		{% elif a.status == 3 %}
									         			<button  type="button" class="btn btn-outline btn-info">已入库</button>
									         		{% elif a.status == 4 %}
									         			<button  type="button" class="btn btn-outline btn-default">未使用</button>
									         		{% endif %}
									         </td>	
									         <td class="text-center">
									         	<a href="/assets_view/{{a.id}}" style="text-decoration:none;"><button  type="button" class="btn btn-default"><abbr title="查看详细信息"><i class="glyphicon glyphicon-info-sign"></i></abbr></button></a>
									         	{% if a.assets_type == "server" or a.assets_type == "vmser" %}
												<div class="btn-group">				
												   <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
												   	   <font class="glyphicon glyphicon-refresh"></font>
												       <span class="caret"></span>
												   </button>										   									         	
										         	<ul class="dropdown-menu" role="menu">
														  <li>
													      	<a href="javascript:" onclick='assetsUpdate(this,{{a.server_assets.id}},"{{a.server_assets.ip}}","setup")'>更新主体信息</a>
													      </li>		
													      <li>
													      	<a href="javascript:" onclick='assetsUpdate(this,{{a.server_assets.id}},"{{a.server_assets.ip}}","crawHw")'>更新内存硬盘</a>
													      </li>							         	
										         	</ul>
												</div>									         	
									         	{% else %}
												<div class="btn-group">				
												   <button type="button" class="btn btn-success dropdown-toggle disabled" data-toggle="dropdown">
												   	   <font class="glyphicon glyphicon-refresh"></font>
												       <span class="caret"></span>
												   </button>										   									         	
												</div>
									         	{% endif %}
									         	
									         	<a href="/assets_mod/{{a.id}}" style="text-decoration:none;"><button  type="button" class="btn btn-default"><abbr title="修改资料"><i class="glyphicon glyphicon-edit"></button></i></abbr></a>
									         	<button  type="button" class="btn btn-default" onclick="deleteAssets(this,{{a.id}})"><i class="glyphicon glyphicon-trash"></i></button>
									         </td>
	                                    </tr>
	                                 {% endfor %}
                                </tbody>
                            </table>
                            <!-- /.table-responsive -->
                            <div class="well">
								<h4>设备资产更新说明</h4>
	                            <ol>
	                                <li><p>点击<i class="glyphicon glyphicon-info-sign"></i>查看设备资产明细</li>
	                                <li><p>点击<i class="glyphicon glyphicon-refresh"></i>更新设备信息</p></li>
	                                <li><p>点击<i class="glyphicon glyphicon-edit"></i>编辑设备信息</p></li>
	                                <li><p>点击<i class="glyphicon glyphicon-trash"></i>删除设备信息</p></li>
	                            </ol>                            
                                
                                
                                <a class="btn btn-default btn-lg btn-block" target="_blank" href="/assets_add"><i class="fa fa-plus-circle "></i>新增资产</a>
                            </div>
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
	 </div>
	 
        <div class="modal fade" id="myAssetsImportModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Excel文件批量导入资产</h4>
                    </div>
                    <form role="form" method="post" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"  enctype="multipart/form-data" action='/assets_import/' class="main form-horizontal">{% csrf_token %}
                     <div class="modal-body">
                         	<div class="form-group">
								 <label class="col-sm-2 control-label">上传文件</label>
								 <div class="col-sm-6">
								 	<input type="file" name="import_file"  placeholder="上传excel文件" required/>
								 </div>
							</div>
                         
                     <div class="modal-footer">
                         <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                         <button type="submit" class="btn btn-primary">导入</button>
                     </div>
                    </form>
                </div>
                <!-- /.modal-content -->
           </div>
           <!-- /.modal-dialog -->
       </div>                                                       
	 
</div>
	






    <!-- /#wrapper -->
	

	<!--    弹窗开始样式 -->
   	<script src="/static/dist/js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>
   	<link rel="stylesheet" type="text/css" href="/static/dist/css/xcConfirm.css"/>
   	<!--   csrf -->
	<script src="/static/js/csrf.js"></script>

    <script type="text/javascript">
        var curpage = 1;
        $(document).ready(function () {       

            //业务类型
            $('#selBusiness').change(function () {
                if ($('#selBusiness').val() != "") {
                    $("#hdnBusiness").val($('#selBusiness').val());
                    var span = "<span class='label label-success' id='spanBusiness'>" + $("#selBusiness").find("option:selected").text()
                    + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='business' type='hidden' value='"
                    + $('#selBusiness').val() + "' /></span> &nbsp;";
                    if ($("#spanBusiness").length == 0) {
                        $('#divSelectedType').append(span);
                    }
                    else {
                        $("#spanBusiness").html($("#selBusiness").find("option:selected").text()
                         + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='business' type='hidden' value='"
                         + $('#selBusiness').val() + "' /></span> &nbsp;");
                    }
                    changepage(1);
                }
            })   
            
			//设备状态
            $('#selStatus').change(function () {
                if ($('#selStatus').val() != "") {
                    $("#hdnStatus").val($('#selStatus').val());
                    var span = "<span class='label label-success' id='spanStatus'>" + $("#selStatus").find("option:selected").text()
                    + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='status' type='hidden' value='"
                    + $('#selStatus').val() + "' /></span> &nbsp;";
                    if ($("#spanStatus").length == 0) {
                        $('#divSelectedType').append(span);
                    }
                    else {
                        $("#spanStatus").html($("#selStatus").find("option:selected").text()
                         + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='status' type='hidden' value='"
                         + $('#selStatus').val() + "' /></span> &nbsp;");
                    }
                    changepage(1);
                }
            })  
            //ip地址
            $('#ip').change(function () {
                if ($('#ip').val() != "") {
                    var span = "<span class='label label-success' id='spanIp'>" + $("#ip").val()
                    + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='ip' type='hidden' value='"
                    + $('#ip').val() + "' /></span> &nbsp;";
                    if ($("#spanIp").length == 0) {
                        $('#divSelectedType').append(span);
                    }
                    else {
                        $("#spanIp").html($("#ip").val()
                         + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='ip' type='hidden' value='"
                         + $('#ip').val() + "' /></span> &nbsp;");
                    }
                    changepage(1);
                }
            })             
			//所属项目
            $('#selProject').change(function () {
                if ($('#selProject').val() != "") {
                    $("#hdnProject").val($('#selProject').val());
                    var span = "<span class='label label-success' id='spanSelinux'>" + $("#selProject").find("option:selected").text()
                    + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='project' type='hidden' value='"
                    + $('#selProject').val() + "' /></span> &nbsp;";
                    if ($("#spanSelinux").length == 0) {
                        $('#divSelectedType').append(span);
                    }
                    else {
                        $("#spanSelinux").html($("#selProject").find("option:selected").text()
                         + " <img alt='' src='/static/img/close.png' onclick='removeself(this)' /><input name='project' type='hidden' value='"
                         + $('#selProject').val() + "' /></span> &nbsp;");
                    }
                    changepage(1);
                }
            })            
            
        })

        function search_go() {
            var parameter = {};
            $("input[type='hidden']").each(function () {
                var key = $(this).prop('name');
                var value = $(this).val();
                if (key != "csrfmiddlewaretoken"){
                	parameter[key] = value;
                }
                
            })

            var count = 0;
            for (var i in parameter) {
                count += i;
                break;
            }
            if (count == 0) {
                return false;
            }

            $.post('/assets_search/', parameter, function (result) {
                if (result["data"].length > 0) {
/*                 	document.getElementById("div-search-result").style.display = ""; */
						 var table = $('#assetsListTable').dataTable();
						 oSettings = table.fnSettings();
						 table.fnClearTable(this);
						 for (var i=0; i<result["data"].length; i++)
						 {
						   table.oApi._fnAddData(oSettings, result["data"][i]);
						 }
						 oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
						 table.fnDraw();                	               	
                }
                else{
                	//没有数据就清空
                	var table = $('#assetsListTable').dataTable();
                	table.fnClearTable(this);
                }
            })
        }

        function changepage(pageindex) {
            curpage = pageindex;
            search_go();
        }

        function removeself(obj) {
            $(obj).parent().remove();
            changepage(1);
        }
        

</script>

<script type="text/javascript"> 

	var selectState = false;  
	function checkAllBox(){ 
	  	var qcheck=document.getElementsByName("ckbox");
	  	for (var i = 0; i < qcheck.length; i++)  
		  {  
		    var checkbox = qcheck[i];  
		    checkbox.checked = !selectState; 
		  }  
	  	selectState = !selectState; 
	}  


	var downLoadFile = function (options) {
	    var config = $.extend(true, { method: 'post' }, options);
	    var $iframe = $('<iframe id="down-file-iframe"/>');
	    var $form = $("<form target='down-file-iframe' method=" + config.method + " />");
	    $form.attr('action', config.url);
	    for (var key in config.data) {
	    	console.log('<input type="hidden" name="' + key + '" value="' + config.data[key] +  '"/>');
	        $form.append('<input type="hidden" name="' + key + '" value="' + config.data[key] +  '"/>');
	    }
	    $form.append("{% csrf_token %}");
	    $iframe.append($form);
	    $(document.body).append($iframe);
	    $form[0].submit();
	    $iframe.remove();
	}	
	
	function fcDumpsAssetsData(obj){
		var btnObj = $(obj);
		btnObj.attr('disabled',true);
		var serverId = [];
	    var url = "/assets/batch/dumps/";	
	    $.each($("input[name='ckbox']:checkbox"),function(){
            if(this.checked){
				serverId.push($(this).val());
            }
        })
        if (serverId.length > 0){
	         var data = {
					'assetsIds':serverId,
	         };
	        downLoadFile({ //调用下载方法
			        url:url,data:data
			        }); 
        }
        else{
        	window.wxc.xcConfirm("至少选择一个资产~", window.wxc.xcConfirm.typeEnum.error);
        }
        btnObj.removeAttr('disabled');
		}
	

	function updateAllAssets(obj,model){
		var btnObj = $(obj);
		btnObj.attr('disabled',true);
		var serverId = [];
	  	var qcheck=document.getElementsByName("ckbox");
	  	for (var i = 0; i < qcheck.length; i++){  
	  		if(qcheck[i].checked==true){
	  			serverId.push(qcheck[i].value);
	  		}
		}
	  	if (model=='update'){
	  		var url = '/assets/batch/update/'
	  	}
	  	else if (model=='delete'){
	  		var url = '/assets/batch/delete/'
	  	}
	  	if (serverId.length > 0){
			$.ajax({
				  type: 'POST',
				  url: url,
				  dataType:"json",
				  data:{
					  'assetsIds':serverId,
				  },
			      success:function(response){	
			    	var sip = '';
			    	var fip = '';
			    	var modal = '';
		    		for  (var i = 0; i < response['data']['success'].length; i++){
		    			 sip += response['data']['success'][i] + '<br>'
		    		}
		    		for  (var i = 0; i < response['data']['failed'].length; i++){
		    			 fip += response['data']['failed'][i] + '<br>'
		    		}	
		    		msg = '成功：'+ '<br>' + sip + '<br>' + '失败：'+ '<br>' + fip;	
 			    	if (response['code']==200){
			    		 window.wxc.xcConfirm(msg, window.wxc.xcConfirm.typeEnum.success);
			    	}
			    	else{
			    		window.wxc.xcConfirm(msg, window.wxc.xcConfirm.typeEnum.error);
			    	}
				    btnObj.removeAttr('disabled');		            
			      },
	              error:function(response){
	            	btnObj.removeAttr('disabled');
	            	window.wxc.xcConfirm("更新失败！", window.wxc.xcConfirm.typeEnum.error);	
	              }
				});			
	  	}
	  	else{
	  		window.wxc.xcConfirm("至少选择一个资产~", window.wxc.xcConfirm.typeEnum.error);
	  		btnObj.removeAttr('disabled');
	  	}
	}

 
	function format ( dataList ) {
	    var trHtml = '';
		for (var i=0; i <dataList.length; i++){	
			trHtml += '<tr><td>'+ dataList[i]["name"] +':</td>'+ '<td>'+ dataList[i]["value"] +'</td></tr>'			        
		};	
 	    var vHtml = '<fieldset>' +
		    			'<legend>硬件信息</legend>' +
		    				'<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+ 
		    				  trHtml  +
		    				'</table>'
					'</fieldset>'; 				
	    return vHtml;
	}	
 	
	$(document).ready(function() {
	    var table = $('#assetsListTable').DataTable( {
/* 	        "ajax": "../ajax/data/objects.txt", */
	        "columns": [
	            {
	                "className": 'details-control',
	                "orderable": false,
	                "data":      null,
	                "defaultContent": ''
	            },
	            { "data": "全选" },
	            { "data": "资产ID" },
	            { "data": "资产类型" },
	            { "data": "管理IP" },
	            { "data": "资产编号" },
	            { "data": "设备型号" },
	            { "data": "放置区域" },
	            { "data": "产品线" },
	            { "data": "业务类型" },
	            { "data": "使用组" },
	            { "data": "设备状态" },
	            { "data": "操作" }
	        ],
	        "order": [[2, 'asc']]
	    } );
	     
	    // Add event listener for opening and closing details
	    $('#assetsListTable tbody').on('click', 'td.details-control', function () {
	    	var dataList = [];
	        var tr = $(this).closest('tr');
	        var row = table.row( tr );
	        aId = row.data()["资产ID"];
	        $.ajax({
	            url : "/api/assets/info/"+aId+"/",
	            type : "post",
	            async : false,
	            data : {"id":aId},
	            dataType : "json",
	            success : function(result) {
	            	dataList = result.data;
	            }
	        });	        
/* 	    	console.log(dataList); */
	        if ( row.child.isShown() ) {
	            // This row is already open - close it
	            row.child.hide();
	            tr.removeClass('shown');
	        }
	        else {
	            // Open this row
	            row.child( format(dataList) ).show();
	            tr.addClass('shown');
	        }
	    } );
	} ); 	
 	
	//Flot Pie Chart
	$(function() {
	    var data = [
	                {% for ds in assetsNumber %}
	           		{
	           			{% if ds.assets_type == "server" %}
	         				label: "服务器",
			         	{% elif ds.assets_type == "vmser" %}
               				label: "虚拟机",		         				
	         			{% elif ds.assets_type == "switch" %}
	           				label: "交换机",
	         			{% elif ds.assets_type == "route" %}
	         				label: "路由器",	
	         			{% elif ds.assets_type == "printer" %}
	         				label: "打印机",	
	         			{% elif ds.assets_type == "scanner" %}
	         				label: "扫描仪",
	         			{% elif ds.assets_type == "firewall" %}
	         				label: "防火墙",	
	         			{% elif ds.assets_type == "storage" %}
	         				label: "存储设备",
	         			{% elif ds.assets_type == "wifi" %}
	         				label: "无线设备",									         													         												         												         											         												         			
	         			{% endif %}
	               		data: {{ ds.dcount }}
	           		},
	           {% endfor %}                
				];
	
	    var plotObj = $.plot($("#assets_per"), data, {
	        series: {
	            pie: {
	                show: true
	            }
	        },
	        grid: {
	            hoverable: true
	        },
	        tooltip: true,
	        tooltipOpts: {
	            content: "%p.0%, %s", // show percentages, rounding to 2 decimal places
	            shifts: {
	                x: 20,
	                y: 0
	            },
	            defaultTheme: false
	        }
	    });
	
	});

	$(function() {
	    Morris.Donut({
	        element: 'asset_number',
	        data: [
	               {% for ds in assetsNumber %}
	               		{
	               			{% if ds.assets_type == "server" %}
		         				label: "服务器",
		         			{% elif ds.assets_type == "switch" %}
	               				label: "交换机",
			         		{% elif ds.assets_type == "vmser" %}
	               				label: "虚拟机",	               				
		         			{% elif ds.assets_type == "route" %}
		         				label: "路由器",	
		         			{% elif ds.assets_type == "printer" %}
		         				label: "打印机",	
		         			{% elif ds.assets_type == "scanner" %}
		         				label: "扫描仪",
		         			{% elif ds.assets_type == "firewall" %}
		         				label: "防火墙",	
		         			{% elif ds.assets_type == "storage" %}
		         				label: "存储设备",
		         			{% elif ds.assets_type == "wifi" %}
		         				label: "无线设备",									         													         												         												         											         												         			
		         			{% endif %}
	                   		value: {{ ds.dcount }}
	               		},
	               {% endfor %}
	               ],
	        resize: true
	    });
	    
	});

	function deleteAssets(obj,id){
		var txt=  "是否确认删除？";
		var btnObj = $(obj);
		btnObj.attr('disabled',true);
		var option = {
			title: "删除当前资产",
			btn: parseInt("0011",2),
			onOk: function(){
				$.ajax({
					  type: 'DELETE',
					  url: '/api/assets/'+id+'/',
				      success:function(response){	
				    	btnObj.removeAttr('disabled');
			            window.wxc.xcConfirm("删除成功", window.wxc.xcConfirm.typeEnum.success);
			            location.reload('/assets_list/');
				      },
		              error:function(response){
		            	btnObj.removeAttr('disabled');
		            	window.wxc.xcConfirm("删除失败！", window.wxc.xcConfirm.typeEnum.error);	
		              }
					});
			},
			onCancel:function(){	
			},
			onClose:function(){
			}
		}
		window.wxc.xcConfirm(txt, "custom", option);			   
	}

	function assetsUpdate(obj, id,ip,type){
			var btnObj = $(obj);
			var txt=  "是否确认更新？";
			var option = {
					title: "更新主机("+ip+")硬件信息",
					btn: parseInt("0011",2),
					onOk: function(){
						$.ajax({
							  type: 'POST',
							  url: '/assets_facts/',
							  data:{
									"ip":ip,
									"server_id":id,
									"type":type
								},
						      success:function(response){			            
					                if (response["code"]=="200"){ 
					                	window.wxc.xcConfirm(response["msg"], window.wxc.xcConfirm.typeEnum.success);

					                }
						        	else{
						        		window.wxc.xcConfirm(response["msg"], window.wxc.xcConfirm.typeEnum.error);
						        	}						                
							},
				            error:function(response){
				            	window.wxc.xcConfirm("请求数据错误！", window.wxc.xcConfirm.typeEnum.error);
				            },		
							});
					},
					onCancel:function(){	
					},
					onClose:function(){
					}
				}			
			window.wxc.xcConfirm(txt, "custom", option);
		}
				

	   
</script>  

  
    
</body>

</html>
